<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name='referrer' content="no-referrer">
    <title>欢迎来到在线教育网站</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="../../js/jquery.js" type="text/javascript" charset="utf-8"></script>
    <script src="//at.alicdn.com/t/font_2896317_23hrd4wpj2k.js"></script>
    <script src="/js/dream-msg.min.js" type="text/javascript" charset="UTF-8"></script>
    <script src="../../js/public.js"></script>
    <script src="/js/agora-rtm-sdk-1.4.3.js"></script>
    <script src="/js/wow.min.js"></script>
    <link rel="stylesheet" href="/css/loading.css">
    <link rel="stylesheet" type="text/css" href="../../css/public.css">
    <link rel="stylesheet" href="./teachers.css">
    <title>Document</title>
</head>

<body class="bg">
    <div class="block1 ">
        <div class="block2 animated fadeInDown">在线寻找您理想的中文辅导老师-在线汉语课程</div>
        <div class="block3 animated fadeInDown">
            <div class="title-hide">您要去中国工作了吗？只是兴趣爱好？需要灵活的时间？想在家里，咖啡厅，办公室学习汉语？我们都可以满足你的要求。 我们有几千名认证老师，确保您能找到满意的。更具..
            </div>
            <div class="title-show">您要去中国工作了吗？只是兴趣爱好？需要灵活的时间？想在家里，咖啡厅，办公室学习汉语？我们都可以满足你的要求。
                我们有几千名认证老师，确保您能找到满意的。更具您的水平，预算，时间来筛选吧。</div>
            <div class="block4">+ 查看更多</div>
        </div>
        <div class="block8 animated fadeInDown" style="z-index: 21;">
            <div class="block5">
                <div class="block6">
                    <div class="block9">起价 / 50分钟</div>
                    <div class="block7">
                        <div class="money">$1-$10000</div>
                        <i class="iconfont icon-xiangxiasanjiaoxing xiahua"></i>
                    </div>
                </div>
                <div class="block6">
                    <div class="block9">出生地</div>
                    <div class="block7">
                        <div class="selectArea">选择出生地</div>
                        <i class="iconfont icon-xiangxiasanjiaoxing xiahua"></i>
                    </div>
                </div>
                <div class="block6">
                    <div class="block9">我的时间</div>
                    <div class="block7">
                        <div class="selectTime">选择时间段</div>
                        <i class="iconfont icon-xiangxiasanjiaoxing xiahua"></i>
                    </div>
                </div>
                <div class="block6">
                    <div class="block9">擅长</div>
                    <div class="block7">
                        <div class="selectGood">选择擅长</div>
                        <i class="iconfont icon-xiangxiasanjiaoxing xiahua"></i>
                    </div>
                </div>
                <div class="block6">
                    <div class="block9">老师还会讲</div>
                    <div class="block7">
                        <div class="selectLanguage">选择语言</div>
                        <i class="iconfont icon-xiangxiasanjiaoxing xiahua"></i>
                    </div>
                </div>
            </div>
            <div class="block90" style="display: none;">
                <div class="block91" id="block91" style="visibility: hidden;">
                    <div class="block93">
                        <div class="text1">$
                            <input class="block99" max="99" min="1" value="1" type="number" required
                                autocomplete='off' />
                        </div>
                        <div>~</div>
                        <div class="text2">$
                            <input class="block99" style="width: 70px;" max="100" min="2" value="10000" type="number"
                                autocomplete='off' required />
                        </div>
                    </div>
                    <div class="block95">
                        <div class="block96"></div>
                        <div class="block97"></div>
                    </div>
                </div>
                <div class="block91 block92" id="block92" style="visibility: hidden;">
                    <div class="block101">
                        <input placeholder="输入并搜索..." type="text" name="" id="" class="block100">
                        <div class="block104"></div>
                    </div>
                </div>
                <div class="block91 block106" id="block93" style="visibility: hidden;">
                    <div class="block109">
                        <div class="block110">请选择时间段</div>
                        <div class="block111">
                            <div class="block112 block113">
                                <i class="iconfont icon-shijian "></i>
                                <span>6~9</span>
                            </div>
                            <div class="block112 block113">
                                <i class="iconfont icon-shijian "></i>
                                <span>9~12</span>
                            </div>
                            <div class="block112 block113">
                                <i class="iconfont icon-shijian "></i>
                                <span>12~15</span>
                            </div>
                            <div class="block112 block115">
                                <i class="iconfont icon-shijian "></i>
                                <span>15~18</span>
                            </div>
                            <div class="block112 block114">
                                <i class="iconfont icon-shijian "></i>
                                <span>18~21</span>
                            </div>
                            <div class="block112 block114">
                                <i class="iconfont icon-shijian "></i>
                                <span>21~24</span>
                            </div>
                            <div class="block112 block114">
                                <i class="iconfont icon-shijian "></i>
                                <span>0~3</span>
                            </div>
                            <div class="block112">
                                <i class="iconfont icon-shijian "></i>
                                <span>3~6</span>
                            </div>
                        </div>
                        <div class="block116">请选择星期几</div>
                        <div class="block117">
                            <div class="block119">星期日</div>
                            <div class="block119">星期一</div>
                            <div class="block119">星期二</div>
                            <div class="block119">星期三</div>
                            <div class="block119">星期四</div>
                            <div class="block119">星期五</div>
                            <div class="block119" style="border-right: none;">星期六</div>
                        </div>
                    </div>
                </div>
                <div class="block91 block107" id="block94" style="visibility: hidden;">
                    <div class="block118">

                    </div>
                </div>
                <div class="block91 block108" id="block95" style="visibility: hidden;">
                    <div class="block118">

                    </div>
                </div>
            </div>
        </div>
        <div class="block8 block101 animated fadeInDown" style="margin-top: 17px;z-index: 3;width:90vw">
            <div class="block10">
                <div class="block16">
                    <div class="block13">
                        <div style="margin-left: 20px;">排序方式</div>
                        <i class="iconfont icon-xiangxiasanjiaoxing filter-select"
                            style="margin-right: 19px;font-size: 20px;"></i>
                    </div>
                    <div class="filter">
                        <div class="filter-div" data-key='state-1'>人气度低到高</div>
                        <div class="filter-div" data-key='state-1'>起价:降序</div>
                        <div class="filter-div" data-key='state-2'>起码:升序</div>
                        <div class="filter-div" data-key='state-2'>高评分</div>
                    </div>
                </div>

                <div class="block15">
                    <input class='header-input' type="text" placeholder="按名字或者关键词查询" style="color: #8A959E;">
                    <i class="iconfont icon-sousuo header-icon-search"></i>
                </div>
            </div>
        </div>
        <div class="block17">
            <img src="../../static/teacher.png" />
        </div>
    </div>
    <div style="display: flex">
        <div style="display: flex;flex-direction: column;">
            <div class="block8" style="max-width: 800px;min-width: 800px;width: 800px;">
                <div class="block18 ">
                </div>
            </div>
            <div class="block56">
                <div class="block57">
                    <span style="color:#666666">最受欢迎三位老师</span>
                </div>
                <div class="block58"></div>
            </div>
            <div class="block73">
                <div class="list2"></div>
            </div>
        </div>
        <div class="block20 wow slideInDown animated">
            <div class="block53"></div>
            <div class="block41">
                <video class="video-source" controls style='width:100%; height:100%; object-fit: fill'>
                    <!--https://www.runoob.com/try/demo_source/movie.mp4-->
                    <source src="" type="video/mp4">
                </video>
            </div>
            <div class="block43">提示：按照您的时区显示时间</div>
            <div class="block44">
                <div class="block45">Mon</div>
                <div class="block45">Tue</div>
                <div class="block45">Web</div>
                <div class="block45">Thu</div>
                <div class="block45">Fri</div>
                <div class="block45">Sat</div>
                <div class="block45">Sun</div>
                <div class="block45 isactive"></div>
                <div class="block45 isactive"></div>
                <div class="block45 isactive"></div>
                <div class="block45 isactive"></div>
                <div class="block45 isactive"></div>
                <div class="block45 isactive"></div>
                <div class="block45 isactive"></div>
            </div>
            <div class="block49">
                <div class="block50">
                    <div class="block51"></div>
                    <div>有其他学生预约</div>
                </div>
                <div class="block50">
                    <div class="block52"></div>
                    <div>可以预约</div>
                </div>
            </div>
        </div>
    </div>




    <div class="mask" id="mask" style="display: none;"></div>
</body>
<script>


    //离开关闭定时器
    $(window).bind("beforeunload", function () {
        clearInterval(tingtime)
    })
    $(document).ready(function () {

        // 页头生成
        productheader('body', 3, 2);
        // 放开信息
        $('.icon-xinxi').show();
        // 页尾生成
        productfooter('body', 4);

    })

    $('.block4')[0].addEventListener('click', (e) => {
        if (e.target.innerHTML === '+ 查看更多') {
            $('.title-hide').hide()
            $('.title-show').show()
            e.target.innerHTML = '- 收起'
        } else {
            $('.title-hide').show()
            $('.title-show').hide()
            e.target.innerHTML = '+ 查看更多'
        }

    })

    let selectCountry = [],
        selectSkill = [],
        selectLanguge = [],
        scrollIndex = 1,
        data = []

    let selectTime = '',
        selectDay = ''

    let country = [],
        skilled = [{
            skill: '日常口语'
        }, {
            skill: '旅游口语'
        }, {
            skill: '商务汉语'
        }, {
            skill: '儿童汉语'
        }, {
            skill: 'HSK'
        }, {
            skill: 'BCT'
        }, {
            skill: 'YCT'
        }, {
            skill: 'TOCFL'
        }, {
            skill: '发音特训'
        }],
        language = [{
            type: '汉语'
        }, {
            type: '英语'
        }, {
            type: '日语'
        }, {
            type: '韩语'
        }, {
            type: '阿拉伯语'
        }, {
            type: '俄语'
        }, {
            type: '西班牙语'
        }, {
            type: '泰语'
        }, {
            type: '越南语'
        }]

    var geolocation = [
        ["CN", "中国"],
        ["AO", "安哥拉"],
        ["AF", "阿富汗"],
        ["AL", "阿尔巴尼亚"],
        ["DZ", "阿尔及利亚"],
        ["AD", "安道尔共和国"],
        ["AI", "安圭拉岛"],
        ["AG", "安提瓜和巴布达"],
        ["AR", "阿根廷"],
        ["AM", "亚美尼亚"],
        ["AU", "澳大利亚"],
        ["AT", "奥地利"],
        ["AZ", "阿塞拜疆"],
        ["BS", "巴哈马"],
        ["BH", "巴林"],
        ["BD", "孟加拉国"],
        ["BB", "巴巴多斯"],
        ["BY", "白俄罗斯"],
        ["BE", "比利时"],
        ["BZ", "伯利兹"],
        ["BJ", "贝宁"],
        ["BM", "百慕大群岛"],
        ["BO", "玻利维亚"],
        ["BW", "博茨瓦纳"],
        ["BR", "巴西"],
        ["BN", "文莱"],
        ["BG", "保加利亚"],
        ["BF", "布基纳法索"],
        ["MM", "缅甸"],
        ["BI", "布隆迪"],
        ["CM", "喀麦隆"],
        ["CA", "加拿大"],
        ["CF", "中非共和国"],
        ["TD", "乍得"],
        ["CL", "智利"],
        ["CO", "哥伦比亚"],
        ["CG", "刚果"],
        ["CK", "库克群岛"],
        ["CR", "哥斯达黎加"],
        ["CU", "古巴"],
        ["CY", "塞浦路斯"],
        ["CZ", "捷克"],
        ["DK", "丹麦"],
        ["DJ", "吉布提"],
        ["DO", "多米尼加共和国"],
        ["EC", "厄瓜多尔"],
        ["EG", "埃及"],
        ["SV", "萨尔瓦多"],
        ["EE", "爱沙尼亚"],
        ["ET", "埃塞俄比亚"],
        ["FJ", "斐济"],
        ["FI", "芬兰"],
        ["FR", "法国"],
        ["GF", "法属圭亚那"],
        ["GA", "加蓬"],
        ["GM", "冈比亚"],
        ["GE", "格鲁吉亚"],
        ["DE", "德国"],
        ["GH", "加纳"],
        ["GI", "直布罗陀"],
        ["GR", "希腊"],
        ["GD", "格林纳达"],
        ["GU", "关岛"],
        ["GT", "危地马拉"],
        ["GN", "几内亚"],
        ["GY", "圭亚那"],
        ["HT", "海地"],
        ["HN", "洪都拉斯"],
        ["HK", "香港"],
        ["HU", "匈牙利"],
        ["IS", "冰岛"],
        ["IN", "印度"],
        ["ID", "印度尼西亚"],
        ["IR", "伊朗"],
        ["IQ", "伊拉克"],
        ["IE", "爱尔兰"],
        ["IL", "以色列"],
        ["IT", "意大利"],
        ["JM", "牙买加"],
        ["JP", "日本"],
        ["JO", "约旦"],
        ["KH", "柬埔寨"],
        ["KZ", "哈萨克斯坦"],
        ["KE", "肯尼亚"],
        ["KR", "韩国"],
        ["KW", "科威特"],
        ["KG", "吉尔吉斯坦"],
        ["LA", "老挝"],
        ["LV", "拉脱维亚"],
        ["LB", "黎巴嫩"],
        ["LS", "莱索托"],
        ["LR", "利比里亚"],
        ["LY", "利比亚"],
        ["LI", "列支敦士登"],
        ["LT", "立陶宛"],
        ["LU", "卢森堡"],
        ["MO", "澳门"],
        ["MG", "马达加斯加"],
        ["MW", "马拉维"],
        ["MY", "马来西亚"],
        ["MV", "马尔代夫"],
        ["ML", "马里"],
        ["MT", "马耳他"],
        ["MU", "毛里求斯"],
        ["MX", "墨西哥"],
        ["MD", "摩尔多瓦"],
        ["MC", "摩纳哥"],
        ["MN", "蒙古"],
        ["MS", "蒙特塞拉特岛"],
        ["MA", "摩洛哥"],
        ["MZ", "莫桑比克"],
        ["NA", "纳米比亚"],
        ["NR", "瑙鲁"],
        ["NP", "尼泊尔"],
        ["NL", "荷兰"],
        ["NZ", "新西兰"],
        ["NI", "尼加拉瓜"],
        ["NE", "尼日尔"],
        ["NG", "尼日利亚"],
        ["KP", "朝鲜"],
        ["NO", "挪威"],
        ["OM", "阿曼"],
        ["PK", "巴基斯坦"],
        ["PA", "巴拿马"],
        ["PG", "巴布亚新几内亚"],
        ["PY", "巴拉圭"],
        ["PE", "秘鲁"],
        ["PH", "菲律宾"],
        ["PL", "波兰"],
        ["PF", "法属玻利尼西亚"],
        ["PT", "葡萄牙"],
        ["PR", "波多黎各"],
        ["QA", "卡塔尔"],
        ["RO", "罗马尼亚"],
        ["RU", "俄罗斯"],
        ["LC", "圣卢西亚"],
        ["VC", "圣文森特岛"],
        ["SM", "圣马力诺"],
        ["ST", "圣多美和普林西比"],
        ["SA", "沙特阿拉伯"],
        ["SN", "塞内加尔"],
        ["SC", "塞舌尔"],
        ["SL", "塞拉利昂"],
        ["SG", "新加坡"],
        ["SK", "斯洛伐克"],
        ["SI", "斯洛文尼亚"],
        ["SB", "所罗门群岛"],
        ["SO", "索马里"],
        ["ZA", "南非"],
        ["ES", "西班牙"],
        ["LK", "斯里兰卡"],
        ["SD", "苏丹"],
        ["SR", "苏里南"],
        ["SZ", "斯威士兰"],
        ["SE", "瑞典"],
        ["CH", "瑞士"],
        ["SY", "叙利亚"],
        ["TW", "台湾省"],
        ["TJ", "塔吉克斯坦"],
        ["TZ", "坦桑尼亚"],
        ["TH", "泰国"],
        ["TG", "多哥"],
        ["TO", "汤加"],
        ["TT", "特立尼达和多巴哥"],
        ["TN", "突尼斯"],
        ["TR", "土耳其"],
        ["TM", "土库曼斯坦"],
        ["UG", "乌干达"],
        ["UA", "乌克兰"],
        ["AE", "阿拉伯联合酋长国"],
        ["GB", "英国"],
        ["US", "美国"],
        ["UY", "乌拉圭"],
        ["UZ", "乌兹别克斯坦"],
        ["VE", "委内瑞拉"],
        ["VN", "越南"],
        ["YE", "也门"],
        ["YU", "南斯拉夫"],
        ["ZW", "津巴布韦"],
        ["ZR", "扎伊尔"],
        ["ZM", "赞比亚"]
    ];

    geolocation.forEach(item => {
        let s = {
            en: item[0],
            cn: item[1]
        }
        country.push(s)
    })

    let listPlace = () => {
        let block104 = $('.block104')[0]
        let fragment = document.createDocumentFragment()

        let createDiv = (item) => {
            let label = document.createElement('label')
            label.className = 'block105'
            let inner = `
                <input class='check' type='checkbox'  value=${item.cn} />
                <span class='block103'>${item.cn}</span>
            `
            label.innerHTML = inner
            return label
        }

        country.forEach(item => {
            let label = createDiv(item)
            fragment.appendChild(label)
        })

        block104.appendChild(fragment)

    }

    let listSkill = () => {
        let block118 = $('.block118')[0]
        let fragment = document.createDocumentFragment()

        let createDiv = (item) => {
            let label = document.createElement('label')
            label.className = 'block105'
            let inner = `
                <input class='checkskill' type='checkbox' value=${item.skill} />
                <span class='block103'>${item.skill}</span>
            `
            label.innerHTML = inner
            return label
        }

        skilled.forEach(item => {
            let label = createDiv(item)
            fragment.appendChild(label)
        })

        block118.appendChild(fragment)

    }

    let listLanguage = () => {
        let block118 = $('.block118')[1]
        let fragment = document.createDocumentFragment()

        let createDiv = (item) => {
            let label = document.createElement('label')
            label.className = 'block105'
            let inner = `
                <input class='checklanguage' type='checkbox' value=${item.type} />
                <span class='block103'>${item.type}</span>
            `
            label.innerHTML = inner
            return label
        }

        language.forEach(item => {
            let label = createDiv(item)
            fragment.appendChild(label)
        })

        block118.appendChild(fragment)
    }





    let setHidden = () => {
        $('.block8')[0].style.zIndex = 30
        $('#block91')[0].style.visibility = 'hidden'
        $('#block92')[0].style.visibility = 'hidden'
        $('#block93')[0].style.visibility = 'hidden'
        $('#block94')[0].style.visibility = 'hidden'
        $('#block95')[0].style.visibility = 'hidden'
    }

    $('.xiahua')[0].onclick = () => {
        setHidden()
        if ($('#block91')[0].style.visibility === 'hidden') {
            $('#mask').fadeIn()
            $('.block90').fadeIn()
            $('.block90')[0].style.display = 'flex'
            if (!$('.block96')[0].style.left) {
                $('.block96')[0].style.left = $('.block95')[0].scrollWidth - 23 + 'px'
            }
            $('#block91')[0].style.visibility = 'inherit'

        } else {
            $('#block91')[0].style.visibility = 'hidden'
        }
    }

    $('#mask')[0].onclick = () => {
        document.onmousemove = null;
        $('#mask')[0].style.display = 'none'
        $('#block91')[0].style.visibility = 'hidden'
        $('#block92')[0].style.visibility = 'hidden'
        $('#block93')[0].style.visibility = 'hidden'
        $('#block94')[0].style.visibility = 'hidden'
        $('#block95')[0].style.visibility = 'hidden'
        $('.dialog1')[0] && $('.dialog1')[0].remove()
        $('.dialog2')[0] && $('.dialog2')[0].remove()
        $('.dialog3')[0] && $('.dialog3')[0].remove()
        $('.dialog4')[0] && $('.dialog4')[0].remove()
    }

    $('.xiahua')[1].onclick = () => {
        setHidden()
        if ($('#block92')[0].style.visibility === 'hidden') {
            $('#mask').fadeIn()
            $('.block90').fadeIn()
            $('.block90')[0].style.display = 'flex'
            $('#block92')[0].style.visibility = 'inherit'

        } else {
            $('#block92')[0].style.visibility = 'hidden'
        }
    }

    $('.xiahua')[2].onclick = () => {
        setHidden()
        if ($('#block93')[0].style.visibility === 'hidden') {
            $('#mask').fadeIn()
            $('.block90').fadeIn()
            $('.block90')[0].style.display = 'flex'
            $('#block93')[0].style.visibility = 'inherit'

        } else {
            $('#block93')[0].style.visibility = 'hidden'
        }
    }

    $('.xiahua')[3].onclick = () => {
        setHidden()
        if ($('#block94')[0].style.visibility === 'hidden') {
            $('#mask').fadeIn()
            $('.block90').fadeIn()
            $('.block90')[0].style.display = 'flex'
            $('#block94')[0].style.visibility = 'inherit'

        } else {
            $('#block94')[0].style.visibility = 'hidden'
        }
    }

    $('.xiahua')[4].onclick = () => {
        setHidden()
        if ($('#block95')[0].style.visibility === 'hidden') {
            $('#mask').fadeIn()
            $('.block90').fadeIn()
            $('.block90')[0].style.display = 'flex'
            $('#block95')[0].style.visibility = 'inherit'

        } else {
            $('#block95')[0].style.visibility = 'hidden'
        }
    }




    window.onload = () => {
        let list = $('.block18')[0],
            list2 = $('.block73')[0],
            dos,
            timer = null

        let setListStyle = async function () {
            let parents = $(this.target).parents('div')
            let block = Array.from(parents).filter(item => {
                return item.className.includes('block19')
            })
            if (block.length) {
                let { index, teacherid } = block[0].dataset
                if (index === scrollIndex) return
                scrollIndex = index
                console.log(index, teacherid)
                if (index === '1') {
                    $('.block20')[0].style.cssText = 'margin-top:40px'
                } else if (index === '2') {
                    let scrollHeight = (index - 1) * $('.block19')[index - 1].scrollHeight
                    $('.block20')[0].style.cssText = `margin-top:${scrollHeight + 55}px`
                } else if (index !== '0') {
                    let scrollHeight = (index - 1) * $('.block19')[index - 1].scrollHeight
                    let marginTop = (index - 1) * 15
                    $('.block20')[0].style.cssText = `margin-top:${scrollHeight + marginTop + 40}px`
                }
                let time = [], timestamp = []
                let res = await ajax("teaching_period_query", {
                    "userid": teacherid
                }, "post")

                res.data.forEach(item => {
                    if (item.cuyear === new Date().getFullYear() && item.cumonth === new Date().getMonth() + 1) {
                        let coursetime = item.coursetime - (new Date().getDay() === 0 ? 7 : new Date().getDay())
                        if (coursetime >= 0) {
                            if (coursetime === 0) {
                                let year = new Date().getFullYear()
                                let month = new Date().getMonth() + 1
                                let date = new Date().getDate()
                                let hour = item.timequantum
                                let day = new Date(year + '-' + month + '-' + date + ' ' + hour).getDay()
                                if (day === 0) { day = 6 }
                                if (new Date(year + '-' + month + '-' + date + ' ' + hour).getTime() > new Date().getTime()) {
                                    time.push(day - 1)
                                    timestamp.push(new Date(year + '-' + month + '-' + date + ' ' + hour).getTime())
                                }
                            } else {
                                let dates = new Date(new Date().getTime() + (1000 * 60 * 60 * 24 * coursetime))
                                time.push(dates.getDay() === 0 ? 6 : dates.getDay() - 1)
                                let newDate = dates.getFullYear() + '-' + parseInt(dates.getMonth() + 1) + '-' + dates.getDate() + '  ' + item.timequantum
                                timestamp.push(new Date(newDate).getTime())
                            }
                        }
                    }
                })
                console.log(res, 'resres')
                timestamp.sort((a, b) => { return a - b })
                window.timestamp = timestamp
                $('.isactive').each(function (index) {
                    $(this)[0].style.cssText = ''
                })
                time.forEach((item, index) => {
                    if (!isNaN(item)) {
                        $('.isactive')[item].style.cssText = 'background:#00FF00'
                    }
                })
                $('.video-source')[0].remove
                $('.block41')[0].innerHTML = `
                    <video class="video-source" controls style='width:100%; height:100%; object-fit: fill'>
                        <source  src="${res.data[0].video}"
                            type="video/mp4">
                    </video>
                `
                console.log(time)
            }
        }

        let setList2Style = async function () {
            let parents = $(this.target).parents('div')
            let block = Array.from(parents).filter(item => {
                return item.className.includes('block19')
            })
            if (block.length) {
                let { index, teacherid } = block[0].dataset
                if (index === scrollIndex) return
                scrollIndex = index
                let scrollHeight1 = $('.block8')[2].scrollHeight
                let scrollHeight2 = $('.block56')[0].scrollHeight
                let scrollHeight3 = 59
                let scrollHeight4 = 0
                if (index - 4) {
                    scrollHeight4 = $('.block19')[index - 4].scrollHeight * (index - 4) + 14 * (index - 4)
                }
                $('.block20')[0].style.cssText = `margin-top:${scrollHeight1 + scrollHeight2 + scrollHeight3 + scrollHeight4}px`
                let time = [], timestamp = []
                let res = await ajax("teaching_period_query", {
                    "userid": teacherid
                }, "post")

                res.data.forEach(item => {
                    if (item.cuyear === new Date().getFullYear() && item.cumonth === new Date().getMonth() + 1) {
                        let coursetime = item.coursetime - (new Date().getDay() === 0 ? 7 : new Date().getDay())
                        if (coursetime >= 0) {
                            if (coursetime === 0) {
                                let year = new Date().getFullYear()
                                let month = new Date().getMonth() + 1
                                let date = new Date().getDate()
                                let hour = item.timequantum
                                let day = new Date(year + '-' + month + '-' + date + ' ' + hour).getDay()
                                if (day === 0) { day = 6 }
                                if (new Date(year + '-' + month + '-' + date + ' ' + hour).getTime() > new Date().getTime()) {
                                    time.push(day - 1)
                                    timestamp.push(new Date(year + '-' + month + '-' + date + ' ' + hour).getTime())
                                }
                            } else {
                                let dates = new Date(new Date().getTime() + (1000 * 60 * 60 * 24 * coursetime))
                                time.push(dates.getDay() === 0 ? 6 : dates.getDay() - 1)
                                let newDate = dates.getFullYear() + '-' + parseInt(dates.getMonth() + 1) + '-' + dates.getDate() + '  ' + item.timequantum
                                timestamp.push(new Date(newDate).getTime())
                            }
                        }
                    }
                })
                timestamp.sort((a, b) => { return a - b })
                window.currentIndex = index
                window.timestamp = timestamp
                $('.isactive').each(function (index) {
                    $(this)[0].style.cssText = ''
                })
                time.forEach((item, index) => {
                    $('.isactive')[item].style.cssText = 'background:#00FF00'
                })
                $('.video-source')[0].remove
                $('.block41')[0].innerHTML = `
                    <video class="video-source" controls style='width:100%; height:100%; object-fit: fill'>
                        <source  src="${res.data[0].video}"
                            type="video/mp4">
                    </video>
                `
                console.log(time)
            }

        }


        dos = function (e, fn) {
            if (timer !== null) {
                clearTimeout(timer);
            }
            timer = setTimeout(function () {
                fn.call(e)
            }, 1);
        }

        window.requestAnimationFrame(() => {
            listPlace()
            listSkill()
            listLanguage()

            list.onmouseover = (e) => {
                dos(e, setListStyle)
            }

            list2.onmouseover = (e) => {
                dos(e, setList2Style)
            }

        })

        new WOW().init();

    }

</script>
<script type="module">
    import { getTeacher, maxs, mins, dialogFiveStep } from './components/teachers.js'
    getTeacher()
    maxs()
    mins()
    // dialogFiveStep()

</script>

</html>